<include file="public:header"/>
<include file="public:sidebar"/>
<div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>
            查看评论 <sub>{$info.title}</sub>
        </h1>
        <button type="button" class="layui-btn layui-btn-sm"
           onclick="history.go(-1)" style="margin-top: 10px;"><i class="layui-icon">&#xe65c;</i>返回</button>
        <ol class="breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> 首页</a></li>
            <li class="active">评论</li>
        </ol>
    </section>
    <hr>
    <!-- Main content -->
    <section class="content">
        <div class="col-md-12">
            <div class="tools">
                <div class="tools-button">
                    <!--<a href="{:Url('article/add_comment')}" class="layui-btn layui-btn-sm layui-btn-radius layui-btn-normal">-->
                        <!--<i class="layui-icon">&#xe654;</i>添加-->
                    <!--</a>-->
                    <!--<a class="layui-btn layui-btn-sm layui-btn-radius layui-btn-danger deleteAll">-->
                    <!--<i class="layui-icon">&#xe640;</i>删除-->
                    <!--</a>-->
                </div>
                <div class="tool-search" style="margin-top: 10px;">
                    <form class="layui-form" autocomplete="off">
                        <div class="layui-inline">
                            <input type="text" name="content" placeholder="请输入评论"
                                class="layui-input">
                            <input type="hidden" name="page" id="pages" value="">
                        </div>
                        <div class="layui-inline">
                            <select name="status">
                                <option value=""></option>
                                <option value="1">未审核</option>
                                <option value="2">正常</option>
                                <option value="3">禁用</option>
                            </select>
                        </div>
                        <div class="layui-inline">
                            <input type="text"  placeholder="请选择时间"
                                   readonly name="date" style="width: 200px"
                                   class="layui-input" id="test1">
                        </div>
                        <div class="layui-inline">
                            <button class="layui-btn" lay-submit lay-filter="search">搜索</button>
                        </div>
                    </form>
                </div>
            </div>
            <table class="table layui-table">
                <thead>
                <tr>
<!--                    <th>ID</th>-->
                    <th>评论人</th>
                    <th>评论</th>
                    <th>点赞数</th>
                    <th>是否回复</th>
                    <th>状态</th>
                    <th>评论时间</th>
                    <th></th>
                </tr>
                </thead>
                <tbody>
                <volist name="list" id="vo">
                    <tr>
<!--                        <td>{$vo.id}</td>-->
                        <td>{$vo.nickname}</td>
                        <td>{$vo.content}</td>
                        <td>{$vo.love}</td>
                        <td>
                            <eq name="vo.is_repay" value="0">否</eq>
                            <eq name="vo.is_repay" value="1">是</eq>
                        </td>
                        <td>
                            <eq name="vo.status" value="1">正常</eq>
                            <eq name="vo.status" value="2">禁用</eq>
                        </td>
                        <td>{$vo.create_time}</td>
                        <td>
                            <eq name="vo.status" value="1">
                                <a href="{:Url('article/comment_status')}" data-id="{$vo.id}" data-roule="2" class="disable">禁用</a>
                                <else />
                                <a href="{:Url('article/comment_status')}" data-id="{$vo.id}" data-roule="1" class="disable">正常</a>
                            </eq>
                            <eq name="vo.is_top" value="0">
                                <a href="{:Url('article/is_top')}" data-id="{$vo.id}" class="top">置顶</a>
                                <else />
                                <a href="{:Url('article/is_top')}" data-id="{$vo.id}" class="top">取消置顶</a>
                            </eq>
                            <button href="{:Url('article/reply')}"  data-id="{$vo.id}"
                             <eq name="vo.is_repay" value="1">disabled</eq>
                              style="padding:0;margin:0;color: #333;" class="btn btn-link reply">回复</button>
                            <a href="javascript:;" onclick="del('{$vo.id}')">删除</a>
                        </td>
                    </tr>
                </volist>
                </tbody>
            </table>
            <div class="pull-right" id="page"></div>
        </div>
    </section>
</div>
<include file="public:footer"/>
<script id="demo" type="text/html">
    {{#  layui.each(d.data, function(index, item){ }}
    <tr>
        <td>{{item.nickname}}</td>
        <td>{{item.content}}</td>
        <td>{{item.love}}</td>
        <td>
            {{#  if(item.is_repay === 0){ }}
            否
            {{#  } }}
            {{#  if(item.is_repay === 1){ }}
            是
            {{#  } }}
        </td>
        <td>
            {{#  if(item.status === 1){ }}
            正常
            {{#  } }}
            {{#  if(item.status === 2){ }}
            禁用
            {{#  } }}
        </td>
        <td>{{item.create_time}}</td>
        <td>
            {{#  if(item.status === 1){ }}
            <a href="{:Url('article/comment_status')}" data-id="{{ item.id }}" data-roule="2" class="disable">禁用</a>
            {{#  } }}
            {{#  if(item.status === 2){ }}
            <a href="{:Url('article/comment_status')}" data-id="{{ item.id }}" data-roule="1" class="disable">正常</a>
            {{#  } }}
            {{#  if(item.is_top === 0){ }}
            <a href="{:Url('article/is_top')}" data-id="{{item.id}}"
               class="top">置顶</a>
            {{#  } }}
            {{#  if(item.is_top === 1){ }}
            <a href="{:Url('article/is_top')}" data-id="{{item.id}}"
               class="top">取消置顶</a>
            {{#  } }}
            {{#  if(item.is_repay === 0){ }}
            <button href="{:Url('article/reply')}"
               data-id="{{item.id}}" style="padding:0;margin:0;color: #333;"
               class="btn btn-link reply">回复</button>
            {{#  } }}
            {{#  if(item.is_repay === 1){ }}
            <button href="{:Url('article/reply')}"
               disabled data-id="{{item.id}}" style="padding:0;margin:0;color: #333;"
               class="btn btn-link reply">回复</button>
            {{#  } }}
            <a href="javascript:;" onclick="del('{{item.id}}')">删除</a>
        </td>
    </tr>
    {{#  }); }}
</script>
<script>
    var currentPage = 1;
    var url = "{:Url('article/comment?id='.$info['id'])}";
    var ids = [];
    $(document).ready( function () {
        layui.use(['layer','form','laydate','laypage'],function () {
            var layer = layui.layer,
                laydate = layui.laydate,
                form = layui.form,
                laypage = layui.laypage;

            form.on('submit(search)',function (data) {
                init();
                return false;
            });
            laydate.render({
                elem: '#test1',
                type: 'date',
                range: '~',
                format: 'yyyy-MM-dd',
            });
            laypage.render({
                elem: 'page',
                count: Number('{$total}'),
                limit: 10,
                layout: ['prev','page','next','skip'],
                theme: '#c00',
                jump: function(obj, first){
                    $('#pages').val(obj.curr);
                    if(!first){
                        init();
                    }
                }
            });
        });
        $(document).on('click','.reply',function (e) {
            e.preventDefault();
            var url =$(this).attr('href'),
                id = $(this).attr('data-id');
            layer.prompt(function(value, index, elem){
                $.post(url,{id:id,content:value},function (result) {
                    if(result.code ){
                        layer.alert(result.msg,{icon: 5});
                        return false;
                    }
                    layer.alert(result.msg,{icon: 6,end:function () {
                            init();
                        }});
                });
                layer.close(index);
            });
        });
        $(document).on('click','.disable',function (e) {
            e.preventDefault();
            var url =$(this).attr('href'),
                status = $(this).attr('data-roule'),
                id = $(this).attr('data-id');
            layer.confirm('您确定要进行此操作吗?', {icon: 3, title:'提示'}, function(index){
                $.post(url,{id:id,status:status},function (result) {
                    if(result.code ){
                        layer.alert(result.msg,{icon: 5});
                        return false;
                    }
                    layer.alert(result.msg,{icon: 6,end:function () {
                            init();
                        }});
                });
                layer.close(index);
            });
        });
        $(document).on('click','.top',function (e) {
            e.preventDefault();
            var url =$(this).attr('href'),
                id = $(this).attr('data-id');
            layer.confirm('您确定要进行此操作吗?', {icon: 3, title:'提示'}, function(index){
                $.post(url,{id:id,status:status},function (result) {
                    if(result.code){
                        layer.alert(result.msg,{icon: 5});
                        return false;
                    }
                    layer.alert(result.msg,{icon: 6,end:function () {
                        init();
                    }});
                });
                layer.close(index);
            });
        });

    });
    function init(){
        var data = $('form').serialize();
        layui.use(['laytpl','layer'],function () {
            var laytpl = layui.laytpl,
                layer = layui.layer;
            var index = layer.load(2,{shade: [0.8, '#000']});
            $.post(url,data,function (result) {
                layer.close(index);
                if(result.code === 0){
                    var getTpl = demo.innerHTML;
                    laytpl(getTpl).render(result.data, function(html){
                        $('table>tbody').html(html);
                        $('#pages').val(result.data.current_page);
                    });
                }
            });
        });
    }
    function del(id) {
        layer.confirm('您确定要删除吗，删除后不能恢复?', {icon: 3, title:'提示'}, function(index){
            $.post('{:Url("article/del")}',{id: id},function (result) {
                if(result.code ){
                    layer.alert(result.msg,{icon: 5});
                    return false;
                }
                layer.alert(result.msg,{icon: 6,end:function () {
                        init();
                    }});
            });
            layer.close(index);
        });
    }
</script>